<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/public.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/css/seller/category_style.css">
    <link rel="stylesheet" href="${pageContext.request.contextPath}/static/iconFont/iconfont.css">
    <style>

        @import url("//unpkg.com/element-ui@2.15.1/lib/theme-chalk/index.css");

        body, button, input, select, textarea {
            font: 12px/1.5 tahoma,arial,'Hiragino Sans GB',"Microsoft Yahei",宋体,sans-serif;
            font-size: 12px;
            line-height: 1.5;
            font-family: tahoma, arial, "Hiragino Sans GB", "Microsoft Yahei", 宋体, sans-serif;
        }

        body {
            font-family: Roboto,Helvetica Neue,Helvetica,Tahoma,Arial,PingFang SC,Microsoft YaHei;
            font-size: 12px;
            line-height: 1.28571;
            color: #222;
        }

        body {
            background: #f0f2f5 !important;
            padding-bottom: 18px;
            width: 100%;
            height: 100%;
        }
    </style>
</head>
<body>
<script src="//unpkg.com/vue/dist/vue.js"></script>
<script src="//unpkg.com/element-ui@2.15.1/lib/index.js"></script>
<script src="${pageContext.request.contextPath}/static/js/frame/jquery-3.5.1.min.js"></script>
<script src="${pageContext.request.contextPath}/static/js/frame/totoro-utils.js"></script>
<script src="${pageContext.request.contextPath}/static/js/frame/ChinesePY.js"></script>
<script src="${pageContext.request.contextPath}/static/js/frame/jquery-form.js"></script>

<!-- head start -->
<div id="seller-nav" style="width: 1380px; height: 36px; border-bottom: 1px solid #f0f0f0;"></div>
<div id="seller-announce">
    <!-- message -->
    <span style="color: #666">
        <b class="announce-b"><svg t="1621306672661" class="icon" viewBox="0 0 1024 1024" version="1.1"
                                   xmlns="http://www.w3.org/2000/svg" p-id="9631" width="20" height="20"><path
                d="M512 170.666667a341.333333 341.333333 0 1 1 0 682.666666 341.333333 341.333333 0 0 1 0-682.666666z"
                fill="#005DFC" p-id="9632"></path><path
                d="M512 426.666667a21.333333 21.333333 0 0 1 21.333333 21.333333v256a21.333333 21.333333 0 1 1-42.666666 0v-256a21.333333 21.333333 0 0 1 21.333333-21.333333z"
                fill="#FFFFFF" p-id="9633"></path><path
                d="M512 330.666667m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z"
                fill="#FFFFFF" p-id="9634"></path></svg></b>
          通知！新《食安法》要求经营食品卖家需办证传证（初级农产品除外），不合规商品1月开始将陆续强制下架！
        <a href="//shangjiafuwu.bbs.taobao.com/detail.html?postId=1921779" target="_blank" style="color:#0085d7;">
            详情点击
        </a>
    </span>
</div>
<!-- head end -->

<!-- title start -->
<div id="header" style="margin-bottom: 30px;">
    <div class="clearfix">
        <h1 class="logo">
            <a class="iconfont icon-tianmaotmall" href="#" target="_top" style="font-size: 30px; color: #FF4200"></a>
            <a href="//myseller.taobao.com/seller_admin.htm" class="sub-logo" target="_top"
               data-spm-anchor-id="a313o.7775905.a1zvu.2" style="color: #404040; font-size: 22px">商品发布</a>
        </h1>
    </div>
</div>
<!-- title end-->

<!-- content start -->

<div id="root">
    <div class="" id="ROOT" style="display: block;">
        <div class="" id="smart-publish-header" style="display: block;">
            <div class="sell-feedback-message">
                <div role="alert" content="商品发布已升级为智能发布，工作量平均将减少70%，商品发布时长平均降低30%。遇到问题请加入钉钉群：32619647 反馈。"
                     class="next-message next-message-notice next-inline next-medium next-only-content">
                    <i class="next-icon next-medium next-message-symbol next-message-symbol-icon"
                       style="position: relative;top: 20px;">
                        <svg t="1621307677755" class="icon" viewBox="0 0 1024 1024" version="1.1"
                             xmlns="http://www.w3.org/2000/svg" p-id="9786" width="17" height="17">
                            <path d="M512 938.666667a426.666667 426.666667 0 1 1 426.666667-426.666667 426.666667 426.666667 0 0 1-426.666667 426.666667z m0-810.666667a384 384 0 1 0 384 384A384 384 0 0 0 512 128z"
                                  p-id="9787" fill="#28A1E3">
                            </path>
                            <path d="M512 302.933333m-25.6 0a25.6 25.6 0 1 0 51.2 0 25.6 25.6 0 1 0-51.2 0Z" p-id="9788"
                                  fill="#28A1E3"></path>
                            <path d="M490.666667 384m21.333333 0l0 0q21.333333 0 21.333333 21.333333l0 362.666667q0 21.333333-21.333333 21.333333l0 0q-21.333333 0-21.333333-21.333333l0-362.666667q0-21.333333 21.333333-21.333333Z"
                                  p-id="9789" fill="#28A1E3">
                            </path>
                        </svg>
                    </i>
                    <div class="next-message-content">
                        <div class="sell-feedback-content">
                            <div>商品发布已升级为智能发布，工作量平均将减少70%，商品发布时长平均降低30%。遇到问题请加入钉钉群：32619647 反馈。</div>
                        </div>
                        <div class="actions">
                            <div class="next-btn-group next-split-btn">
                                <a class="next-btn next-small next-btn-secondary">
                                    <span class="next-btn-helper">操作指南</span></a>
                                <a aria-haspopup="true"
                                   class="next-btn next-small next-btn-secondary next-split-btn-trigger"
                                   style="padding: 2;">
                                    <i class="next-icon iconfont icon-jiantou9"></i></a>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="sell-error-board hide" style="position: fixed; top: 45px;">
                <div class="l-error-board" style="max-height: 428.4px; overflow: auto;">
                    <div class="header">
                        <div class="title" style="display: none">发布助手</div>
                        <div class="btn-toggle" title="收起"><i class="next-icon next-icon-arrow-up next-xs"></i></div>
                    </div>
                    <div class="next-tabs next-tabs-pure next-medium">
                        <div class="next-tabs-bar" style="background: rgb(255, 255, 255) none repeat scroll 0% 0%;">
                            <div class="next-tabs-nav-container">
                                <div class="next-tabs-nav-wrap">
                                    <div class="next-tabs-nav-scroll">
                                        <ul role="tablist" class="next-tabs-nav"></ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div style="padding: 0px; min-height: 0px;" class="next-tabs-content"></div>
                    </div>
                </div>
            </div>
        </div>
        <div class="" id="struct-step-0" style="display: block;">
            <div class="next-loading sell-block" id="card-block">
                <div class="next-loading-wrap"><h2 class="title">欢迎使用新版商品发布！</h2>
                    <div class="content" data-spm-anchor-id="a213gs.14012018.0.i1.14144831CdFrQb">
                        <form method="post" action="/uploadFiles.htm" enctype="multipart/form-data" id="uploadImg">
                        <div dir="ltr" role="row" class="next-row  sell-o-addon" id="struct-catImages">
                            <div dir="ltr" role="gridcell" class="next-col next-col-fixed-8 sell-o-addon-label"
                                 data-spm-anchor-id="a213gs.14012018.0.i0.14144831CdFrQb">
                                <div class="left-wrap">
                                    <div class="label"><span class="required">*</span>上传商品主图</div>
                                </div>
                            </div>
                            <div dir="ltr" role="gridcell" class="next-col sell-o-addon-content">
                                <div class="sell-o-addon-info">
                                    <div class="sell-rich-text sell-o-rich-text top">
                                        上传高清正面商品主图，可快速智能识别及填充商品信息，帮您智能选择发布类目，上传清晰商品正面图，自动生成白底图
                                    </div>
                                    <div class="info-content">
                                        <div class="sell-images">
                                            <div class="sell-o-images">
                                                <div class="image-uploader">
                                                    <div class="image-list-wrap">
                                                        <div class="drag-image-item-wrapper" draggable="true">
                                                            <div class="sell-o-image-item"
                                                                 style="width: 100px; height: 100px;">
                                                                <p class="placeholder"><span class="required">＊</span>
                                                                    商品主图</p>
                                                                <div class="image-upload-btn">
                                                                    <div class="upload-content">
                                                                        <i class="next-icon next-icon-add next-large upload-btn-icon iconfont icon-jia"
                                                                           style="font-weight: 400; font-size: 40px"></i>
                                                                        <p class="upload-text">添加上传图片</p></div>
                                                                </div>
                                                                <div class="sell-o-image-item-preview">
                                                                    <div class="image-tools">
                                                                        <span class="tool"></span>
                                                                        <i class="next-icon next-icon-ashbin next-small tool image-upload-remove iconfont icon-shanchu"></i>
                                                                        <i class="next-icon next-icon-arrow-right next-small tool move-right iconfont icon-youjiantou"></i>
                                                                    </div>
                                                                </div>
                                                                <input type="file" name="images" class="img-upload" style="display: none" data-value="1"/>
                                                            </div>
                                                        </div>
                                                        <div class="drag-image-item-wrapper" draggable="true">
                                                            <div class="sell-o-image-item"
                                                                 style="width: 100px; height: 100px;"><p
                                                                    class="placeholder"></p>
                                                                <div class="image-upload-btn">
                                                                    <div class="upload-content">
                                                                        <i class="next-icon next-icon-add next-large upload-btn-icon iconfont icon-jia"
                                                                           style="font-weight: 400; font-size: 40px"></i>
                                                                        <p class="upload-text">添加上传图片</p></div>
                                                                </div>
                                                                <div class="sell-o-image-item-preview">
                                                                    <div class="image-tools"><i
                                                                            class="next-icon next-icon-arrow-left next-small tool move-left iconfont icon-zuojiantou"></i>
                                                                        <i class="next-icon next-icon-ashbin next-small tool image-upload-remove iconfont icon-shanchu"></i>
                                                                        <i class="next-icon next-icon-arrow-right next-small tool move-right iconfont icon-youjiantou"></i>
                                                                    </div>
                                                                </div>
                                                                <input type="file" name="images" class="img-upload" style="display: none" data-value="2"/>

                                                            </div>
                                                        </div>
                                                        <div class="drag-image-item-wrapper" draggable="true">
                                                            <div class="sell-o-image-item"
                                                                 style="width: 100px; height: 100px;"><p
                                                                    class="placeholder"></p>
                                                                <div class="image-upload-btn">
                                                                    <div class="upload-content">
                                                                        <i class="next-icon next-icon-add next-large upload-btn-icon iconfont icon-jia"
                                                                           style="font-weight: 400; font-size: 40px"></i>
                                                                        <p class="upload-text">添加上传图片</p></div>
                                                                </div>
                                                                <div class="sell-o-image-item-preview">
                                                                    <div class="image-tools"><i
                                                                            class="next-icon next-icon-arrow-left next-small tool move-left iconfont icon-zuojiantou"></i><i
                                                                            class="next-icon next-icon-ashbin next-small tool image-upload-remove iconfont icon-shanchu"></i><i
                                                                            class="next-icon next-icon-arrow-right next-small tool move-right iconfont icon-youjiantou"></i>
                                                                    </div>
                                                                </div>
                                                                <input type="file" name="images" class="img-upload" style="display: none"/>

                                                            </div>
                                                        </div>
                                                        <div class="drag-image-item-wrapper" draggable="true">
                                                            <div class="sell-o-image-item"
                                                                 style="width: 100px; height: 100px;"><p
                                                                    class="placeholder"></p>
                                                                <div class="image-upload-btn">
                                                                    <div class="upload-content">
                                                                        <i class="next-icon next-icon-add next-large upload-btn-icon iconfont icon-jia"
                                                                           style="font-weight: 400; font-size: 40px"></i>
                                                                        <p class="upload-text">添加上传图片</p></div>
                                                                </div>
                                                                <div class="sell-o-image-item-preview">
                                                                    <div class="image-tools"><i
                                                                            class="next-icon next-icon-arrow-left next-small tool move-left iconfont icon-zuojiantou"></i><i
                                                                            class="next-icon next-icon-ashbin next-small tool image-upload-remove iconfont icon-shanchu"></i><i
                                                                            class="next-icon next-icon-arrow-right next-small tool move-right iconfont icon-youjiantou"></i>
                                                                    </div>
                                                                </div>
                                                                <input type="file" name="images" class="img-upload" style="display: none"/>

                                                            </div>
                                                        </div>
                                                        <div class="drag-image-item-wrapper" draggable="true">
                                                            <div class="sell-o-image-item"
                                                                 style="width: 100px; height: 100px;"><p
                                                                    class="placeholder"> 商品正面图</p>
                                                                <div class="image-upload-btn">
                                                                    <div class="upload-content">
                                                                        <i class="next-icon next-icon-add next-large upload-btn-icon iconfont icon-jia"
                                                                           style="font-weight: 400; font-size: 40px"></i>
                                                                        <p class="upload-text">添加上传图片</p></div>
                                                                </div>
                                                                <div class="sell-o-image-item-preview">
                                                                    <div class="image-tools">
                                                                        <i  class="next-icon next-icon-arrow-left next-small tool move-left iconfont icon-zuojiantou"></i><i
                                                                            class="next-icon next-icon-ashbin next-small tool image-upload-remove iconfont icon-shanchu"></i>
                                                                    </div>
                                                                </div>
                                                                <input type="file" name="images" class="img-upload" style="display: none"/>

                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        </form>
                        <div class="" id="struct-barcode" style="display: block;position: relative;">
                            <div dir="ltr" role="row" class="next-row  sell-o-addon" id="struct-catBarcodeImage">
                                <div dir="ltr" role="gridcell" class="next-col next-col-fixed-8 sell-o-addon-label">
                                    <div class="left-wrap">
                                        <div class="label"></div>
                                    </div>
                                </div>
                                <div dir="ltr" role="gridcell" class="next-col sell-o-addon-content">
                                    <div class="sell-o-addon-info">
                                        <div class="sell-rich-text sell-o-rich-text top">
                                            (选填)若商品含条码，可选择上传商品条形码，可提高商品识别准确率70%
                                        </div>
                                        <div class="info-content">
                                            <div>
                                                <button type="button"
                                                        class="next-btn next-medium next-btn-normal invoke-media-btn">
                                                    <span class="next-btn-helper">上传或选择条码 </span><i
                                                        class="next-icon next-icon-arrow-down next-xs next-btn-icon next-icon-last iconfont icon-jiantou9"></i>
                                                </button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div dir="ltr" role="row" class="next-row  sell-o-addon" id="struct-catBarcode">
                                <div dir="ltr" role="gridcell" class="next-col next-col-fixed-8 sell-o-addon-label">
                                    <div class="left-wrap">
                                        <div class="label"></div>
                                    </div>
                                </div>
                                <div dir="ltr" role="gridcell" class="next-col sell-o-addon-content">
                                    <div class="sell-o-addon-info">
                                        <div class="info-content"><span class="sell-o-error-hoc"><span
                                                class="sell-o-input sell-input large-input"><span
                                                class="input-wrap"><span
                                                class="next-input next-medium fusion-input">
                                            <input placeholder="输入条形码内容" maxlength="32" autocomplete="off" value="" height="100%">
                                        </span>
                                        </span>
                                        </span>
                                            <div  class="sell-o-message"></div>
                                        </span>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div dir="ltr" role="row" class="next-row  sell-o-addon" id="struct-category">
                            <div dir="ltr" role="gridcell" class="next-col next-col-fixed-8 sell-o-addon-label">
                                <div class="left-wrap">
                                    <div class="label"><span class="required">*</span>确认商品类目</div>
                                </div>
                            </div>
                            <div dir="ltr" role="gridcell" class="next-col sell-o-addon-content">
                                <div class="sell-o-addon-info">
                                    <div class="sell-rich-text sell-o-rich-text top">请确认或修改商品类目</div>
                                    <div class="info-content">
                                        <div class="unfold-category-wrapper">
                                            <div class="l-full-category">
                                                <div class="category-path-wrap category-path">
                                                    <div class="path-info-wrap">
                                                        <div class="path-list"><span class="path-label">已选类目:</span>
                                                        </div>
                                                        <div class="path-tips"></div>
                                                    </div>
                                                    <div class="path-help"></div>
                                                </div>
                                                <div class="category-search-wrap l-category-search"><span
                                                        class="next-select next-select-auto-complete next-size-medium category-search"
                                                        aria-haspopup="true"><span class="next-input next-medium">
                                                    <input class="ct-value" aria-autocomplete="list" aria-disabled="false"
                                                        placeholder="类目搜索：可输入产品名称" autocomplete="off" value=""
                                                        height="100%"/>
                                                </span><span class="next-sr-only"
                                                                                   aria-live="polite"></span></span>
                                                    <button type="button"
                                                            class="next-btn next-medium next-btn-normal search-btn">
                                                        <span class="next-btn-helper">搜索</span></button>
                                                </div>
                                                <div class="category-history category-history-wrap"><span class="label">发布历史:</span>
                                                    <div class="next-tabs next-tabs-text next-small history-list"
                                                         excssmode="slide">
                                                        <div class="next-tabs-bar">
                                                            <div class="next-tabs-nav-container">
                                                                <div class="next-tabs-nav-wrap">
                                                                    <div class="next-tabs-nav-scroll">
                                                                        <ul role="tablist" aria-multiselectable="false"
                                                                            class="next-tabs-nav">
                                                                            <li role="tab" aria-hidden="false"
                                                                                aria-selected="false" tabindex="-1"
                                                                                class="next-tabs-tab">
                                                                                <div class="next-tabs-tab-inner">高帮鞋
                                                                                </div>
                                                                            </li>
                                                                        </ul>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <div class="next-tabs-content"></div>
                                                    </div>
                                                </div>
                                                <div class="next-loading next-loading-inline sell-o-category-selection">
                                                    <div class="next-loading-wrap">
                                                        <div class="cascade-selection category-lists-wrap">
                                                            <div class="next-loading next-loading-inline ct-one" style="height: 100%; width: 25%; margin-left: 0px; position: relative">
                                                                <!-- 加载中 -->
                                                                <img src="//img.lanrentuku.com/img/allimg/1212/5-121204193955-51.gif" class="loading-img" style="display: none">
                                                                <div class="loading-top" style="display: none"></div>
                                                                <div class="loading" style="filter: none">
                                                                    <!-- 加载中 -->
                                                                <div class="next-loading-wrap">
                                                                    <div class="category-list">
                                                                        <div class="search-wrap"><span
                                                                                class="next-input next-medium search-input"><input
                                                                                placeholder="名称/拼音首字母"
                                                                                autocomplete="off" value=""
                                                                                height="100%"></span><i
                                                                                class="next-icon next-icon-search next-small search-icon iconfont icon-ct-sousuo" style="font-size: 25px"></i>
                                                                        </div>
                                                                        <div class="list-frame">
                                                                            <ul class="group-wrap">
                                                                                <!-- 动态添加子元素分类 -->
                                                                            </ul>
                                                                            <div class="list-info"></div>
                                                                        </div>
                                                                    </div>
                                                                </div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div dir="ltr" role="row" class="next-row hidden sell-o-addon" id="struct-selectProp">
                            <div dir="ltr" role="gridcell" class="next-col next-col-fixed-8 sell-o-addon-label">
                                <div class="left-wrap">
                                    <div class="label"></div>
                                </div>
                            </div>
                            <div dir="ltr" role="gridcell" class="next-col sell-o-addon-content">
                                <div class="sell-o-addon-info">
                                    <div class="info-content">
                                        <div dir="ltr" role="row" class="next-row next-row-wrap sell-catProp">
                                            <div dir="ltr" role="gridcell"
                                                 class="next-col next-col-12 left-items"></div>
                                            <div dir="ltr" role="gridcell"
                                                 class="next-col next-col-12 right-items"></div>
                                            <div dir="ltr" role="gridcell"
                                                 class="next-col next-col-24 exclude-items"></div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div style="">
                <div class="next-affix-bottom" style="">
                    <div class="" id="struct-submit-0" style="display: block;">
                        <div class="sell-add-overlay">
                            <button id="submit-category" type="button" class="next-btn next-large next-btn-primary">
                                <span class="next-btn-helper">下一步, 完善商品信息</span>
                            </button>
                            <div class="sell-add-overlay-content"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<!-- content end -->

<!-- 该app为所有绝对效果汇集(懒加载,加载中,vue element) -->
<div id="app">
    <!-- 文件上传按钮 -->
    <input type="file" name="url" class="upload_input" style="display: none"/>
    <!-- 消息提示 -->
    <template>
        <el-button plain @click="imageError" id="image-error" style="display: none"> </el-button>
        <el-button plain @click="searchNull" id="search-null" style="display: none"> </el-button>
    </template>

    <!-- 分类搜索框 start -->
    <div class="next-overlay-inner next-select-popup-wrap category-search-popup" style=" display:none; width: 500px; position: absolute; left: 562.5px; top: 689.483px; z-index: 9999;" aria-hidden="false"><ul role="menu" class="next-menu next-ver search-result">
        <li role="menuitem" origindata="[object Object]" tabindex="0" class="next-menu-item">
            <div class="next-menu-item-inner">
                <span class="next-menu-item-text">
                网络设备/网络相关 &gt; 路由器 &gt; 随身
                <span class="highlight">w</span>
                ifi</span>
            </div>
        </li>
    </ul>
    </div>
    <!-- 分类搜索框 end -->
    <!-- 搜索分类菜单搜索框 加载中 div start-->
    <img src="" data-src="/static/img/seller/loading.gif" class="loading-img-fuzzy" style="display: block; position: absolute; left: 50%; top: 100%; transform: translate(-50%, -50%);    /* 50%为自身尺寸的一半 */">
        <!-- 搜索分类菜单搜索框 加载中 div end-->
</div>
<jsp:include page="/public_page/open_chat.jsp"></jsp:include>
<script>
    var Main = {
        methods: {
            imageError() {
                this.$notify.error({
                    title: '错误 - 天猫商品发布',
                    dangerouslyUseHTMLString: true,
                    message: '<p style="color: red; font-size: 15px">图片大小不能超过3M！</p>',
                    position: 'top-left',
                });
            },
            searchNull() {
                this.$notify.error({
                    title: '错误 - 天猫商品发布',
                    dangerouslyUseHTMLString: true,
                    message: '<p style="color: red; font-size: 15px">搜索不能为空！</p>',
                    position: 'top-left',
                });
            }
        }
    }
    var Ctor = Vue.extend(Main);
    new Ctor().$mount('#app');
</script>
</body>

<script src="${pageContext.request.contextPath}/static/js/self/seller/category.js"></script>
</html>
